import React from 'react'
import { useEffect } from 'react'
import PubSub from 'pubsub-js'
import Father from './components/Father'

export default function App() {
    // componentDidMount 订阅消息
    useEffect(()=>{
        // 订阅凡凡的消息
        let topicId = PubSub.subscribe('fanfan', (msg,data)=>{
            console.log('msg: ', msg)
            console.log('data: ', data)
        })
        // 订阅峰峰的消息
        let topicId2 = PubSub.subscribe('fengfeng', (msg, data)=>{
            console.log('App msg: ', msg)
            console.log('App data: ', data)
        })
        return ()=>{ // componentWillUnmount 取消订阅
            PubSub.unsubscribe(topicId)
            PubSub.unsubscribe(topicId2)
        }
    },[])
    return (
        <div>
            <h3>App</h3>
            <p><button onClick={()=>{
                PubSub.unsubscribe('fengfeng')
            }}>取消订阅峰峰</button></p>
            <p><button onClick={()=>{
                PubSub.clearAllSubscriptions()
            }}>全部取消</button></p>
            <hr />
            <Father />
            
        </div>
    )
}
